.modelConfig {
   position: fixed;
   bottom: 91px;
   width: 100%;
   min-width: 320px;
   max-width: 600px;

   .tabs {
      height: 103px;
      display: flex;
      justify-content: space-evenly;
      align-items: center;

      .tab {
         .icon {
            width: 28px;
            height: 28px;
            background-position: center;
            background-repeat: no-repeat;
            background-size: 100%;

            &.guiti {
               background-image: url(./asset/guizi.png);
            }

            &.chouti {
               background-image: url(./asset/chouti.png);
            }
         }

         .title {
            font-size: 12px;
            font-family: PingFangSC-Regular, PingFang SC;
            font-weight: 400;
            color: #282828;
         }
      }
   }

   .guitiBox, .choutiBox {
      height: 160px;
      background-color: white;

      .header {
         height: 50px;
         display: flex;
         align-items: center;

         .back {
            width: 24px;
            height: 24px;
            margin-left: 20px;
         }

         .list {
            display: flex;
            flex-grow: 1;
            justify-content: space-around;

            .item {
               font-size: 14px;
               font-family: PingFangSC-Regular, PingFang SC;
               font-weight: 400;
               color: #282828;
               border-bottom: 2px solid transparent;

               &.ac {
                  font-size: 14px;
                  font-family: PingFangSC-Semibold, PingFang SC;
                  font-weight: 600;
                  color: #282828;
                  border-bottom: 2px solid #282828;
               }
            }
         }
      }

      .content {
         display: flex;
         align-items: center;
         height: 110px;
         border-top: 1px solid #28282844;
         border-bottom: 1px solid #28282844;
         overflow-y: auto;
         padding-right: 20px;
         .rect {
            flex-shrink: 0;
            width: 75px;
            height: 75px;
            margin-left: 20px;
            border: 1px solid rgba(40,40,40,0.16);
            position: relative;
            text-align: center;
            &.ac {
               border: 1px solid #282828;
            }

            .lt {
               width: 80%;
               height: 80%;
               margin-top: 5px;
            }

            .ct {
               width: 100%;
               position: absolute;
               bottom: 0;
               width: 75px;
               height: 16px;
               background: #28282899;
               line-height: 16px;

               .name {
                  text-align: center;
                  font-size: 10px;
                  font-family: PingFangSC-Regular, PingFang SC;
                  font-weight: 400;
                  color: #FFFFFF;
               }
            }
         }

         .circle {
            width: 75px;
            height: 75px;
            margin-left: 20px;
            position: relative;
            text-align: center;
            .imgBox{
               width: 52px;
               height: 52px;
               display: flex;
               justify-content: center;
               align-items: center;
               margin: auto;
               margin-bottom: 5px;
               border: 1px solid rgba(40,40,40,0.16);
               border-radius: 100%;
               img {
                  width: 44px;
                  height: 44px;
                  border-radius: 100%;
               }
            }
            &.ac{
               .imgBox{
                  border: 1px solid rgba(40,40,40,1);
               }
               
            }

            .name {
               font-size: 10px;
               font-family: PingFangSC-Regular, PingFang SC;
               font-weight: 400;
               color: #282828;
            }
         }
      }
   }
}